<script lang="ts" setup>
  import { ref } from 'vue';
  import dayjs from 'dayjs';
  import Space from '@sscd/space';
  import TimePicker from '@sscd/time-picker';
  const value1 = ref(dayjs('12:08:23', 'HH:mm'));
  const value2 = ref(dayjs('12:08:23', 'HH:mm'));
  const value3 = ref(dayjs('12:08:23', 'HH:mm'));
</script>

<template>
  <div class="demo">
    <div class="demo-title">三种大小</div>
    <div class="demo-content">
      <Space direction="vertical">
        <TimePicker v-model:value="value1" size="large" />
        <TimePicker v-model:value="value2" />
        <TimePicker v-model:value="value3" size="small" />
      </Space>
    </div>
  </div>
</template>
